<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<div class="panel-box">
    <div class="titlebar">
       <span class="glyphicon glyphicon-th-list"></span> เว็บบอร์ด
    </div>
     <div class="panel-body">
     			<button class="btn btn-sm btn-default pull-right" data-toggle="modal" data-target="#createPostDlg"><span class="glyphicon glyphicon-comment"></span> <b>ตั้งกระทู้</b></button>
	     		   <div style="width:10px;">&nbsp</div>
	     		   <div style="width:10px;">&nbsp</div>
                   <table id="tblWebboard" class="table table-striped table-bordered">
                   	<thead>
                   		<tr>
                   			<th width="5%">ลำดับ</th>
                   			<th>หัวข้อเรื่อง</th>
                   			<th width="5%">ดู</th>
                   			<th width="5%">ตอบ</th>
                   			<th width="15%">เขียนโดย</th>
                   			<th width="20%">วันเวลา</th>
                   			<th width="5%"></th>
                   		</tr>
                   	</thead>
                   	<tbody>
                   	<c:if test="${not empty WEBBOARDALLDATA}">
        				<c:forEach items="${WEBBOARDALLDATA}" varStatus="i" var="x">
	                   		<tr>
	                   			<td>${i.index+1}</td>
	                   			<td class="text-left">
	                   				<a href="${pageContext.request.contextPath}/backend/webboard/${x.id}">${x.name}</a>
	                   				<c:set var="now" value="<%=new java.util.Date()%>"/>
	                   				<fmt:formatDate type="date" value="${now}" var="nowDate" />
	                   				<fmt:formatDate type="date" value="${x.createdDate}" var="createDate" />
									<c:if test="${createDate >= nowDate or fn:length(x.listWebboardReply) < 1}">
									    <img src="${pageContext.request.contextPath}/images/new_icon.gif"/>
									</c:if>
	                   			</td>
	                   			<td>${x.viewed}</td>
	                   			<td>${fn:length(x.listWebboardReply)}</td>
	                   			<td class="text-left">${x.createdBy}</td>
	                   			<td class="text-left"><fmt:formatDate pattern="yyyy-MM-dd" value="${x.createdDate}" /> <fmt:formatDate pattern="HH:mm:ss" value="${x.createdDate}" /></td>
	                   			<td>
									<span class='pointer-cursor' data-toggle='modal' data-target='#myModal' onclick='deleteData(${x.id})'>
										<span class='glyphicon glyphicon-trash'></span>
									</span>
	                   			</td>
	                   		</tr>
                   		</c:forEach>
            		</c:if>
                   	</tbody>
                   </table>
     </div>
</div>

<script>
	var selectId = "";
	$(function(){
		$('#tblWebboard').dataTable();
	
		$("#btnPostWebboard").click(function(){
			$.ajax({
				method: "POST",
				url: '${pageContext.request.contextPath}/backend/webboard/postWebboard',
				data: { topicName: $("#txtTopicName").val(), content: $("#txtPostDetail").val(), postBy: $("#txtPostBy").val() },
			 
				success : function(data) {
				    window.location.reload(true);
				}
			});
		});
	});
	
	function deleteData(id){
		selectId = id;
	}
	
	function remove_item(){
		$.ajax({
            url : "${pageContext.request.contextPath}/backend/webboard/delete",
            data: {id: selectId},
            type: "POST",
	        //contentType: 'application/json',
            success : function(data) {
				if(data.success){
					if(data.code === "0000"){
            			$.alertWithCode(data.code, data.msg);
						window.location.reload(true);
					}else{
            			$.alertWithCode(data.code, data.msg);
					}
				}else{
            		$.alertWithCode(data.code, data.msg);
				}
            },
            error : function(data){
            	$.alertWithCode(data.code, data.msg);
            }
        });
        return false;
	}
</script>

	
	
<div class="modal fade" id="createPostDlg" tabindex="-1" role="dialog"  aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">ตั้งหัวข้อกระทู้</h4>
      </div>
      <div class="modal-body">
	        <form>
		 	  <div class="form-group">
			      <label for="txtTopicName">หัวข้อกระทู้ : </label>
			      <input type="text" name="txtTopicName" id="txtTopicName" class="form-control">
		      </div>
		      <div class="form-group">
			      <label for="txtPostDetail">เนื้อหากระทู้ : </label>
			      <textarea rows="5" name="txtPostDetail" id="txtPostDetail" class="form-control"></textarea>
		      </div>
		      <div class="form-group">
			      <label for="txtOwnName">ชื่อผู้โพส : </label>
			      <input type="text" name="txtPostBy" id="txtPostBy" class="form-control" value="ผู้ดูแลระบบ" disabled>
		      </div>
		  </form>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default">ล้างข้อมูล</button>
        <button type="button" id="btnPostWebboard" class="btn btn-primary">ตั้งกระทู้</button>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->




<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
	<form action="${pageContext.request.contextPath}/backend/webboard" onsubmit="return remove_item()" method="post" >
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
					<h4 class="modal-title" id="myModalLabel">ต้องการลบข้อมูล?</h4>
				</div>
				<div class="modal-body">
					ยืนยันลบข้อมูล
				</div>
				<div class="modal-footer">
					<button type="submit" class="btn btn-primary">ตกลง</button>
					<button type="button" class="btn btn-default" data-dismiss="modal">ปิด</button>
				</div>
			</div>
		</div>
	</form>
</div>

































					



















